import React, {useEffect, useState} from 'react'
import {Radio} from 'antd'
import type {RadioChangeEvent} from 'antd'
import styles from './index.less'
import Vehicle from './components/Vehicle'
import Material from './components/Material'
import {getDict} from '@/service/common/dict'
import {getAllParking} from '@/service/storage/archives'

const warehousing = () => {
	const [type, setType] = useState('vehicle')
	const [dictData, setDictData] = useState<any>()
	const [warehouseData, setWarehouseData] = useState<any>([])

	/** 获取仓库列表 */
	const getWarehouseData = () => {
		getAllParking()
			.then((res: any) => {
				setWarehouseData(res.data)
			})
			.catch(() => {
				setWarehouseData([])
			})
	}

	useEffect(() => {
		getWarehouseData()
		getDict(
			{
				dictKeys: ['IN_WAREHOUSE_STATUS', 'IN_WAREHOUSE_TYPE'],
			},
			(res: any) => {
				setDictData(res)
			},
		)
	}, [])

	const onChange = (e: RadioChangeEvent) => {
		setType(e.target.value)
	}

	return (
		<div className={styles.warehousing}>
			<div className={styles.hender}>
				<Radio.Group
					onChange={onChange}
					value={type}
					optionType="button"
					buttonStyle="solid">
					<Radio value="vehicle">车辆</Radio>
					<Radio value="material">物料</Radio>
				</Radio.Group>
			</div>
			<div className={styles.content}>
				{type === 'vehicle' ? (
					<Vehicle
						dictData={dictData}
						warehouseData={warehouseData}
					/>
				) : (
					<Material
						dictData={dictData}
						warehouseData={warehouseData}
					/>
				)}
			</div>
		</div>
	)
}

export default warehousing
